function init() {
  let re = /\active\b/
  let tits = document.getElementsByClassName('tit')
  let modes = document.getElementsByClassName('mode')
  if (tits.length != modes.length) {
    return;
  }

  for (let i = 0; i < tits.length; i++) {
    if (re.test(tits[i].className)) {
      modes[i].style.display = "block"
    } else {
      modes[i].style.display = "none"
    }
    tits[i].onclick = function () {
      for (let i = 0; i < tits.length; i++) {
        tits[i].classList.remove('active')
        modes[i].style.display = 'none'
      }
      tits[i].classList.add('active')
      modes[i].style.display = 'block'
      get_movie_list(i + 1)
    }
  }
  get_movie_list(1)
}


window.onload = init()

var mySwiper = new Swiper('.swiper-container', {
  loop: true,
  autoplay: {
    delay: 1000,
    stopOnLastSlide: false,
    disableOnInteraction: true
  },
  pagination: {
    el: '.swiper-pagination',
  },
  navigation: {
    nextEl: '.swiper-button-next',
    prevEl: '.swiper-button-prev',
  },
  scrollbar: {
    el: '.swiper-scrollbar',
  },
})

function get_movie_list(type) {
  console.log(type)
  $.get(url_mapping.getByType, {type: type}, function (res) {
    console.log(res)
    movie_list(res, type)
  }, 'json')
}

function movie_list(res, type) {
  let modes = $('.mode:eq(' + (type - 1) + ')')
  let movie_body = '<a class="list-body" href="{5}">' +
    '<div class="list-con">' +
    '  <div class="hidden"><img src="{0}" alt="listimg"></div>' +
    '</div>' +
    '<div class="list-title">' +
    '  <h4>{1}</h4>' +
    '  <span>主演：{2}</span>' +
    '  <span>上映时间：{3}</span>' +
    '  <span>评分：{4}</span>' +
    '</div></a>'
  $.each(res.data, function (index, value) {
    modes.append(movie_body.format(value['movieManPicture'], value['movieName'], value['movieStar'], value['movieReleaseDate'], value['movieExpectationValue'],
      'detail.html?id=' + value['movieId']))
  })
  modes.append('<div class="more">加载更多...</div>')
}